

<!DOCTYPE html> 
<html lang="en"> 
<head> 
<meta charset="utf-8" /> 
<title>LuShu Demo</title> 
<script src="http://api.map.baidu.com/api?v=1.2"></script> 

<script type="text/javascript" src="../src/LuShu_min.js"></script>
</head> 
<body> 
<div id="map_canvas" style="width:600px;height:480px"></div> 
<div id="result" style="float:right;position:absolute;left:700px;top:0;"></div>
<button id="run" >run</button> 
<button id="stop">stop</button> 
<button id="pause">pause</button> 
<button id="hide">hide infoWindow</button> 
<button id="show">show infoWindow</button> 
<script> 
var map = new BMap.Map('map_canvas');
map.centerAndZoom(new BMap.Point(157.404, 39.915), 13);
var lushu;
// 实例化一个驾车导航用来生成路线
var drv = new BMap.DrivingRoute('北京', {
    onSearchComplete: function(res) {
        if (drv.getStatus() == BMAP_STATUS_SUCCESS) {
            var arrPois = res.getPlan(0).getRoute(0).getPath();
            map.addOverlay(new BMap.Polyline(arrPois, {strokeColor: '#111'}));
            map.setViewport(arrPois);
            
            lushu = new BMapLib.LuShu(map,arrPois,{
            defaultContent:"从万寿路到朝阳公园",
            speed:4500,
            landmarkPois: [
               {lng:157.414782,lat:39.913508,html:'1',pauseTime:2},
               {lng:157.315000,lat:39.964429,html:'1<div><img src="http://map.baidu.com/img/logo-map.gif"/></div>',pauseTime:3},
               {lng:157.381476,lat:39.974073,html:'1<div><img src="http://ishouji.baidu.com/resource/images/map/show_pic04.gif"/></div>',pauseTime:2}
            ]});          
        }
    }
});
drv.search('北京', '大连');
//绑定事件
$("run").onclick = function(){
    lushu.start();
}
$("stop").onclick = function(){
    lushu.stop();
}
$("pause").onclick = function(){
    lushu.pause();
}
$("hide").onclick = function(){
    lushu.hideInfoWindow();
}
$("show").onclick = function(){
    lushu.showInfoWindow();
}
function $(element){
    return document.getElementById(element);
}
</script> 
</body> 
</html> 